/**
 * コンテキストメニューを管理するクラス
 * @class
 */
var joContextMenu = {

	contextTarget: null,
	
	/**
	 * コンテキストメニューを設定する
	 * @param {Node} aElement コンテキストメニューを表示させる要素
	 * @param {Object} context コンテキストメニュー
	 */
	set: function(aElement, context){
		var uid = joCore.Node.getUniqueID(aElement);
		joEvent.addEvent(aElement, 'rclick', function(e){ this.show(e, context, uid); }, false, this);
	},

	show: function(e, context, uid){
		//ブラウザ固有のコンテキストメニューが表示されるのを防ぐ
		e.preventDefault();
		
		//本当に期待されている要素のコンテキストメニューを開こうとしているのかどうかを調べる
		//もし違っていたら表示しないで終了
//		if(joCore.Node.getUniqueID(joCore.Node.getNodesByPosition(e.clientX, e.clientY)[0]) !== uid) return joCore.logger.log('dont open contextmenu');

		//contextmenu
		var ul = joCore.Node.createNode('ul', { 'class': 'menupopup', id: 'contextmenu' }, document.body);
		this.contextTarget = uid;
		joCore.Node.addStyle(ul, {
			position: 'absolute',
			top: e.clientY + 'px',
			left: e.clientX + 'px',
			'z-index': 1000000,
		});
		ul.appendChild(this._build(context));
		joEvent.addEvent(ul, 'click', this.close, false, this);
		joEvent.addEvent(ul, 'mousedown', function(){}, false, this);
		
		//contextmenu が隠れないように補正する
		var crect = joCore.Node.getNodeRect(ul); //contextmenu rect
		var drect = joCore.Node.getNodeRect($('display')); //display rect
		//right
		if(crect.right > drect.right)
			joCore.Node.addStyle(ul, {
				left: 'auto',
				right: '0'			
			});
		
		//bottom
		if(crect.bottom > drect.bottom)
			joCore.Node.addStyle(ul, {
				top: 'auto',
				bottom: (drect.bottom - e.clientY) + 'px',
			});
		
		//contextmenu を閉じるためのダミーのカバー
		var dc = joCore.Node.createNode('div', { id: 'contextmenu-dammy-cover' }, document.body);  //dammy cover
		joCore.Node.addStyle(dc, {
			position: 'absolute',
			top: 0,
			left: 0,
			width: '100%',
			height: '100%',
			'z-index': '999999',
		});
		joEvent.addEvent(dc, 'lclick', this.close, false, this);
		joEvent.addEvent(dc, 'rclick', function(e){
			this.close(e);
		}, false, this);
	},
	
	close: function(event){
		this.contextTarget = null;
		joCore.Node.remove($('contextmenu-dammy-cover'));
		joCore.Node.remove($('contextmenu'));
	},
	
	_build: function(menuObj){
		var fragment = document.createDocumentFragment();
	
		for(menuname in menuObj){		
			if(typeof menuObj[menuname] === 'object'){
				//submenuがある場合: menupopupを作成
				
				//submenuの親
				var li = joCore.Node.createNode('li', null, fragment);
				joCore.Node.createNode('a', { ':child': menuname }, li);
				
				//submenu本体
				var ul = joCore.Node.createNode('ul', null, li);
				ul.appendChild(arguments.callee.call(this, menuObj[menuname]));
			}else{
				//menuitemを作成
				var li = joCore.Node.createNode('li', null, fragment);
				if(menuObj[menuname])
					joCore.Node.createNode('a', { ':child': menuname, onclick: menuObj[menuname] }, li);
				else
					joCore.Node.createNode('a', { ':child': menuname }, li);
			}
		}
		
		return fragment;
	},
};